<template>
  <div>
    <u-popup :show="show" mode="bottom" @close="close" :closeOnClickOverlay="false" :zIndex="998" :overlayStyle="{'z-index': 997}">
			<view class="message-content">
				<view class="header">
          <u-row justify="space-between" style="width: 100%">
            <view>
              
            </view>
            <view>操作</view>
            <view>
              
            </view>
          </u-row>
        </view>
				<view class="main" style="padding: 20px 10px;">
          <u-row>
            <view class="m-r-10" style="width: 70px;">出库存数:</view>
            <view style="flex: 1">
              <u-number-box v-model="options.outbound" :min="0" :max="options.totalInventory"></u-number-box>
            </view>
          </u-row>
        </view>
				<view class="footer">
          <view class="cancel-btn" @click="close">取消</view>
          <view class="confirm-btn" @click="confirm">确认</view>
        </view>
			</view>
    </u-popup>
  </div>
</template>

<script>
import { toast } from '@/utils/util'
export default {
  data() {
    return {
      show: false,
			callback: null,
      options: {}
    }
  },
  mounted() {},
  methods: {
    open(options, cb) {
      this.options = {...options};
      this.show = true;
      this.callback = cb;
    },
    close() {
      this.callback(false)
      this.show = false;
    },
    confirm() {
      this.$api.food.update(this.options)
      .then(res => {
        if (res.code == 200) {
          this.callback(true)
          this.show = false;
        } else {
          toast(res.message)
        }
      })
    },
    // 业务代码
    selectPerson() {
      this.$refs.personSelect.confirm(data => {
        // 从personSelect组件获取选择的员工信息
        // 传回父页面
        this.callback(data)
        this.show = false;
      })
    }
  }
}
</script>

<style lang="stylus" scoped>
>>> .u-popup__content
  background transparent
.message-content
  width 100vw
  background-color #ffffff
  border-radius 8px 8px 0 0
  position relative
  overflow hidden
  font-size 16px
  .header
    display flex
    justify-content space-between
    align-items center
    height 45px
    background-color #ffffff
    color #444444
    padding 0 10px
    border-bottom 1px solid #eeeeee
  .main
    position relative
    max-height 80vh
    overflow scroll
  .footer
    position relative
    text-align center
    color #ffffff
    height auto
    display flex
    
.confirm-btn
  flex 1
  height 44px
  line-height 44px
  text-align center
  color #FFFFFF
  background-color #0BB78E
  font-size 16px
.cancel-btn
  flex 1
  height 44px
  line-height 44px
  text-align center
  color #333333
  background-color #ffffff
  font-size 16px
  border-top 1px solid #e2e2e2
  box-sizing border-box

.no-data
  text-align center
  padding-top 120px
  color #999999

</style>